@import '@material/menu-surface/mixins.import';
@import '@material/list/mixins.import';
@import '@material/list/variables.import';
@import '../../cdk/a11y/a11y';
@import '../mdc-helpers/mdc-helpers';

@include mdc-menu-surface-core-styles($query: structure);

.mat-mdc-autocomplete-panel {
  width: 100%; // Ensures that the panel matches the overlay width.
  max-height: 256px; // Prevents lists with a lot of option from growing too high.
  position: static; // MDC uses `absolute` by default which will throw off our positioning.
  visibility: hidden;

  // Note that we include this private mixin, because the public
  // one adds a bunch of styles that we aren't using for the menu.
  @include mdc-list-base_($query: structure);
  @include cdk-high-contrast(active, off) {
    outline: solid 1px;
  }

  .cdk-overlay-pane:not(.mat-mdc-autocomplete-panel-above) & {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }

  .mat-mdc-autocomplete-panel-above & {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
}

// These classes are used to toggle the panel's visibility depending on whether it has any options.
.mat-mdc-autocomplete-visible {
  visibility: visible;
}

.mat-mdc-autocomplete-hidden {
  visibility: hidden;
}
